import { componentGroup } from '../types'

export const componentsList = [
  {
    name: 'sidebar.introduction',
    icon: 'emoji_people',
    route: '/introduction',
    examples: 0,
    group: componentGroup.General,
  },
  {
    name: 'sidebar.getting_started',
    icon: 'whatshot',
    icon_outlined: true,
    route: '/start',
    examples: 0,
    group: componentGroup.General,
  },
  {
    name: 'sidebar.theming',
    icon: 'palette',
    icon_outlined: true,
    route: '/theming',
    examples: 0,
    group: componentGroup.General,
  },
  {
    name: 'sidebar.contribution',
    icon: 'edit',
    icon_outlined: true,
    route: '/contribute',
    examples: 0,
    group: componentGroup.General,
  },
  {
    name: 'sidebar.support',
    icon: 'volunteer_activism',
    icon_outlined: true,
    route: '/support',
    examples: 0,
    group: componentGroup.General,
  },
  {
    name: 'sidebar.button',
    icon: 'smart_button',
    route: '/components/button',
    examples: 13,
    group: componentGroup.Base,
  },
  {
    name: 'sidebar.divider',
    icon: 'horizontal_rule',
    route: '/components/divider',
    examples: 2,
    group: componentGroup.Base,
  },
  {
    name: 'sidebar.checkbox',
    icon: 'check_box',
    icon_outlined: true,
    route: '/components/checkbox',
    examples: 5,
    group: componentGroup.Form,
  },
  {
    name: 'sidebar.colorpicker',
    icon: 'palette',
    icon_outlined: true,
    route: '/components/colorpicker',
    examples: 3,
    group: componentGroup.Form,
  },
  {
    name: 'sidebar.datepicker',
    icon: 'calendar_month',
    icon_outlined: true,
    route: '/components/datepicker',
    examples: 3,
    group: componentGroup.Form,
    soon: true,
  },
  {
    name: 'sidebar.input',
    icon: 'text_fields',
    route: '/components/input',
    examples: 5,
    group: componentGroup.Form,
  },
  {
    name: 'sidebar.number_input',
    icon: 'pin',
    icon_outlined: true,
    route: '/components/numberinput',
    examples: 0,
    group: componentGroup.Form,
  },
  {
    name: 'sidebar.radio',
    icon: 'radio_button_checked',
    route: '/components/radio',
    examples: 4,
    group: componentGroup.Form,
  },
  {
    name: 'sidebar.select',
    icon: 'list_alt',
    route: '/components/select',
    examples: 2,
    group: componentGroup.Form,
  },
  {
    name: 'sidebar.slider',
    icon: 'linear_scale',
    route: '/components/slider',
    examples: 3,
    group: componentGroup.Form,
  },
  {
    name: 'sidebar.switch',
    icon: 'toggle_on',
    icon_outlined: true,
    route: '/components/switch',
    examples: 4,
    group: componentGroup.Form,
  },
  {
    name: 'sidebar.textarea',
    icon: 'notes',
    route: '/components/textarea',
    examples: 1,
    group: componentGroup.Form,
  },
  {
    name: 'sidebar.toggle',
    icon: 'swipe',
    icon_outlined: true,
    route: '/components/toggle',
    examples: 2,
    group: componentGroup.Form,
  },
  {
    name: 'sidebar.alert',
    icon: 'feedback',
    icon_outlined: true,
    route: '/components/alert',
    examples: 3,
    group: componentGroup.Feedback,
  },
  {
    name: 'sidebar.drawer',
    icon: 'vertical_split',
    icon_outlined: true,
    route: '/components/drawer',
    examples: 0,
    group: componentGroup.Feedback,
  },
  {
    name: 'sidebar.spinner',
    icon: 'loop',
    route: '/components/spinner',
    examples: 1,
    group: componentGroup.Feedback,
  },
  {
    name: 'sidebar.loading_bar',
    icon: 'space_bar',
    route: '/components/loadingbar',
    examples: 1,
    group: componentGroup.Feedback,
  },
  {
    name: 'sidebar.modal',
    icon: 'call_to_action',
    icon_outlined: true,
    route: '/components/modal',
    examples: 4,
    group: componentGroup.Feedback,
  },
  {
    name: 'sidebar.notification',
    icon: 'notifications',
    icon_outlined: true,
    route: '/components/notification',
    examples: 4,
    group: componentGroup.Feedback,
  },
  {
    name: 'sidebar.popover',
    icon: 'mode_comment',
    icon_outlined: true,
    route: '/components/popover',
    examples: 3,
    group: componentGroup.Feedback,
  },
  {
    name: 'sidebar.progress_bar',
    icon: 'moving',
    route: '/components/progressbar',
    examples: 3,
    group: componentGroup.Feedback,
  },
  {
    name: 'sidebar.avatar',
    icon: 'account_circle',
    icon_outlined: true,
    route: '/components/avatar',
    examples: 8,
    group: componentGroup.DataDisplay,
  },
  {
    name: 'sidebar.collapse',
    icon: 'unfold_more',
    route: '/components/collapse',
    examples: 3,
    group: componentGroup.DataDisplay,
  },
  {
    name: 'sidebar.badge',
    icon: 'mark_chat_unread',
    icon_outlined: true,
    route: '/components/badge',
    examples: 6,
    group: componentGroup.DataDisplay,
  },
  {
    name: 'sidebar.tag',
    icon: 'label',
    icon_outlined: true,
    route: '/components/tag',
    examples: 2,
    group: componentGroup.DataDisplay,
  },
  {
    name: 'sidebar.tabs',
    icon: 'tab',
    icon_outlined: true,
    route: '/components/tabs',
    examples: 2,
    group: componentGroup.DataDisplay,
  },
  {
    name: 'sidebar.tooltip',
    icon: 'live_help',
    icon_outlined: true,
    route: '/components/tooltip',
    examples: 2,
    group: componentGroup.DataDisplay,
  },
  {
    name: 'sidebar.dropdown',
    icon: 'receipt_long',
    icon_outlined: true,
    route: '/components/dropdown',
    examples: 1,
    group: componentGroup.Navigation,
  },
  {
    name: 'sidebar.breadcrumbs',
    icon: 'home',
    icon_outlined: true,
    route: '/components/breadcrumbs',
    examples: 1,
    group: componentGroup.Navigation,
    soon: true,
  },
  {
    name: 'sidebar.steps',
    icon: 'timeline',
    icon_outlined: true,
    route: '/components/steps',
    examples: 1,
    group: componentGroup.Navigation,
    soon: true,
  },
  {
    name: 'sidebar.transitions',
    icon: 'animation',
    icon_outlined: true,
    route: '/transitions',
    examples: 1,
    group: componentGroup.Other,
  },
  {
    name: 'sidebar.directives',
    icon: 'token',
    icon_outlined: true,
    route: '/directives',
    examples: 1,
    group: componentGroup.Other,
  },
]
